var access_token = localStorage.getItem("access_token");
var client_auth = '';
var date = new Date(); // 日期初始化
var BaseUrl = ''; // ajax请求基础路径
var that = new Vue();
var originCssHref = '';

var themeCssFile = '[[@{/}]]';
var themeColor = '';

var cacheDefaultCssLink = '';

function formatDate(date, fmt) {
    if (/(y+)/.test(fmt)) {
        fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
    }
    var o = {
        'M+': date.getMonth() + 1,
        'd+': date.getDate(),
        'h+': date.getHours(),
        'H+': date.getHours(),
        'm+': date.getMinutes(),
        's+': date.getSeconds()
    };
    for (var k in o) {
        if (new RegExp('(' + k + ')').test(fmt)) {
            var str = o[k] + '';
            fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? str : padLeftZero(str));
        }
    }
    return fmt;
}

/**
 *  确认弹框
 header：头部信息默认为“提示”，
 msg：提示信息默认为空，
 confirmButtonText：确认按钮文本，cancelButtonText：取消按钮文本，
 type：弹出框类型默认info，
 center：bool值 弹出框是否居中默认为false
 succFun 确认回调
 errFun  取消回调
 */
function confirmMsg(header, msg, succFun, errFun, confirmButtonText, cancelButtonText, type, center, useHtml) {
    that.$confirm(msg ? msg : '', header ? header : '提示', {
        confirmButtonText: confirmButtonText ? confirmButtonText : '',
        cancelButtonText: cancelButtonText ? cancelButtonText : '',
        type: type ? type : 'warning',
        center: center ? center : false,
        dangerouslyUseHTMLString: useHtml == true ? true : false,
        callback: function (action, instance) {
            if (action == 'confirm') {
                succFun();
            } else {
                errFun();
            }
        },
    })
}

/**
 *    操作消息提示
 header：头部信息默认为“提示”，
 msg：提示信息默认为空，
 confirmButtonText：确认按钮文本，
 type：弹出框类型默认info，
 center：bool值 弹出框是否居中默认为false
 callback 回调
 */
function alertMsg(header, msg, confirmButtonText, type, center, callback, useHtml) {
    that.$alert(msg ? msg : '', header ? header : '提示', {
        confirmButtonText: confirmButtonText ? confirmButtonText : '确定',
        type: type ? type : 'info',
        center: center ? center : false,
        dangerouslyUseHTMLString: useHtml == true ? true : false,
        callback: function (action) {
            if (!callback) {
                return;
            } else if (action == 'confirm') {
                callback();
            }

        }
    });
}


/**
 * 请求服务器;
 * module  模块名称必填
 * @param  param 参数
 * @cb 回调函数
 */
function request(module, param, cbSun, cbErr) {
    requestProxy({
        url: param.url,
        type: param.type,
        data: param.data,
        async: param.async,
        ContentType: param.ContentType,
        timeout: param.timeout
    }, cbSun, cbErr);
}

/**
 * 请求参数:
 * @param  param { url type data timeout} callback
 */
function requestProxy(param, cbSun, cbErr) {
    if (param.type == 'get') {
        if (param.data) {
            param.data.time = new Date().getTime();
        } else {
            param.data = {
                time: new Date().getTime()
            };
        }
    }
    $.ajax({
        type: param.type || 'post',
        dataType: "json",
        data: param.data,
        url: BaseUrl + param.url,
        headers: {
            'Content-Type': param.ContentType || 'application/x-www-form-urlencoded;',
            'Authorization': 'bearer ' + localStorage.getItem("access_token")
        },
        xhrFields: {
            withCredentials: true
        },
        async: typeof param.async === "undefined" ? true : param.async,
        crossDomain: true,
        timeout: param.timeout || 30000,
        success: function (res) {
            if (typeof cbSun === "function") cbSun(res)
        },
        error: function (err, textStatus) {
            //401(登录信息验证不过就跳转到登录页，不再需要回调上层的错误函数)
            //err.status != '401' && typeof cbErr === "function" && cbErr(err);
            if (err.status == '401' && err.responseJSON.clientModel == 'rsServer') {
                client_auth = err.responseJSON.clientAuth;
                var url = window.location.href;
                var serverUrl = err.responseJSON.ssoServerUrl;
                var b = new Base64();
                var baseUrl = b.encode(url);
                var _isLocal = window.location.protocol === 'file:' ? true : false; //本地测试环境
                if (_isLocal) {
                    window.location.href = '/framework-ui/src/main/resources/static/agcloud/login/login.html?reBackurl=' + baseUrl + '&client_auth=' + client_auth + '&serverUrl=' + serverUrl;
                    return;
                } else {
                    //因为opus-admin-ui使用的是c模式，以cookie维持过期时间，而opus-admin-rest使用r模式，以token维持过期时间，当token过期时，c模式应用执行退出登录地址，以跳转到登录页
                    //that.$message.error('登录信息已过期，请重新登录！');
                    //另开标签
                    if (window.opener) {
                        localStorage.removeItem("access_token");
                        window.opener.postMessage({key: 'removeAccessToken'}, '*');
                    } else {
                        if (top !== window.self) {
                            localStorage.removeItem("access_token");
                            window.parent.postMessage({key: 'removeAccessToken'}, '*');
                        } else {
                            localStorage.removeItem("access_token");
                            try {
                                window.vm && window.vm.logoutAfterFn();
                            } catch (e) {
                            }
                            window.location.href = pctx + 'authentication/require?reBackurl=' + baseUrl;
                        }
                        return;
                    }
                }
            } else if (textStatus === "timeout") {
                that.$message.error('请求超时，请重试');
            } else if (err.status == '401' && err.responseJSON.clientModel == 'ssoClient') {
                window.top.location.reload();
            } else {
                // 2020-05-27 去掉该错误信息
                // that.$message({
                //   message: err.message?err.message:''+'未获取到登录信息，请刷新页面！',
                //   type: 'error'
                // });
            }
            typeof cbErr === "function" && cbErr(err);
        }
    });
}

function _getQueryString(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
    var r = window.location.search.substr(1).match(reg); //获取url中"?"符后的字符串并正则匹配
    var context = "";
    if (r != null)
        context = r[2];
    reg = null;
    r = null;
    return context == null || context == "" || context == "undefined" ? "" : context;
}

// 获取token，根据页面url前缀获取 pctx：由配置文件中获取
function _fetchToken(cb) {
    var _that = this;
    var _isLocal = _isLocalConfFn(); //本地测试环境不需要获取token
    if (_isLocal) {
        cb && cb();
        return;
    }
    ;
    cb && cb();//获取token后开始页面的数据加载
    return;
    // 将url中传递过来的access_token保存至本地
    var b = new Base64();
    var access_token = b.decode(_getQueryString('ag_params'));
    if (!!access_token) {
        localStorage.setItem("access_token", access_token);
        var resUrl = window.location.origin + window.location.pathname;
        console.log(access_token)
        window.history.pushState({}, '', resUrl);
    }
    cb && cb();//获取token后开始页面的数据加载
    return;
    request('opus-admin', {
        url: pctx + 'opus/admin/getAccessToken',
        type: 'get',
    }, function (data) {
        if (data && data.success && data.content) {
            localStorage.setItem("access_token", data.content);
            access_token = data.content;
            setTimeout(function () {
                cb && cb();//获取token后开始页面的数据加载
            }, 100)
        } else {
            _that.$message.error(data.message || '获取失败')
        }
    }, function (msg) {
        _that.$message.error(msg.message ? msg.message : '请求失败');
    });
}

function padLeftZero(str) {
    return ('00' + str).substr(str.length);
}

function Base64() {

    // private property
    _keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";

    // public method for encoding
    this.encode = function (input) {
        var output = "";
        var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
        var i = 0;
        input = _utf8_encode(input);
        while (i < input.length) {
            chr1 = input.charCodeAt(i++);
            chr2 = input.charCodeAt(i++);
            chr3 = input.charCodeAt(i++);
            enc1 = chr1 >> 2;
            enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
            enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
            enc4 = chr3 & 63;
            if (isNaN(chr2)) {
                enc3 = enc4 = 64;
            } else if (isNaN(chr3)) {
                enc4 = 64;
            }
            output = output +
                _keyStr.charAt(enc1) + _keyStr.charAt(enc2) +
                _keyStr.charAt(enc3) + _keyStr.charAt(enc4);
        }
        return output;
    }

    // public method for decoding
    this.decode = function (input) {
        var output = "";
        var chr1, chr2, chr3;
        var enc1, enc2, enc3, enc4;
        var i = 0;
        input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");
        while (i < input.length) {
            enc1 = _keyStr.indexOf(input.charAt(i++));
            enc2 = _keyStr.indexOf(input.charAt(i++));
            enc3 = _keyStr.indexOf(input.charAt(i++));
            enc4 = _keyStr.indexOf(input.charAt(i++));
            chr1 = (enc1 << 2) | (enc2 >> 4);
            chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
            chr3 = ((enc3 & 3) << 6) | enc4;
            output = output + String.fromCharCode(chr1);
            if (enc3 != 64) {
                output = output + String.fromCharCode(chr2);
            }
            if (enc4 != 64) {
                output = output + String.fromCharCode(chr3);
            }
        }
        output = _utf8_decode(output);
        return output;
    }

    // private method for UTF-8 encoding
    _utf8_encode = function (string) {
        string = string.replace(/\r\n/g, "\n");
        var utftext = "";
        for (var n = 0; n < string.length; n++) {
            var c = string.charCodeAt(n);
            if (c < 128) {
                utftext += String.fromCharCode(c);
            } else if ((c > 127) && (c < 2048)) {
                utftext += String.fromCharCode((c >> 6) | 192);
                utftext += String.fromCharCode((c & 63) | 128);
            } else {
                utftext += String.fromCharCode((c >> 12) | 224);
                utftext += String.fromCharCode(((c >> 6) & 63) | 128);
                utftext += String.fromCharCode((c & 63) | 128);
            }

        }
        return utftext;
    }

    // private method for UTF-8 decoding
    _utf8_decode = function (utftext) {
        var string = "";
        var i = 0;
        var c = c1 = c2 = 0;
        while (i < utftext.length) {
            c = utftext.charCodeAt(i);
            if (c < 128) {
                string += String.fromCharCode(c);
                i++;
            } else if ((c > 191) && (c < 224)) {
                c2 = utftext.charCodeAt(i + 1);
                string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
                i += 2;
            } else {
                c2 = utftext.charCodeAt(i + 1);
                c3 = utftext.charCodeAt(i + 2);
                string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
                i += 3;
            }
        }
        return string;
    }
}

/**
 * 作者： johnny Li  日期：2020/04/29
 * 错误信息弹窗封装
 * 请求参数:
 * @param {
 *  errorTips: 错误提示信息
 *  errorMsg：更多的错误信息
 *  close: 关闭回调函数
 * }
 */
var errorComponent = Vue.extend({
    template: '<div ref="error" class="error-dialog">\
    <div class="error-box">\
    <div class="error-head">\
    <img :src="ctx + \'/agcloud/framework/js-lib/agcloud-lib/images/icon-error_dialog.png\'" alt="">\
    <i class="close-icon close-sign el-icon-close" @click="close"></i>\
    </div>\
    <div class="error-title">错误提示</div>\
    <div class="error-tip">\
    {{errorTips}}\
    <span class="icon-more" v-if="errorMsg" @click="isShowMore = !isShowMore">{{isShowMore ? "收起" : "更多"}}</span>\
    </div>\
    <div class="more-errorMsg" v-show="isShowMore">\
    {{errorMsg}}\
    </div>\
    <div class="error-btn-box">\
    <button class="close-sign" @click="close">我知道了</button>\
    </div>\
    </div>\
    </div>',
    data: function () {
        return {
            ctx: ctx,
            isShowDialog: true, // 通过这个属性，控制是否移除dom元素
            errorTips: '',
            errorMsg: '',
            isShowMore: false
        }
    },
    methods: {
        close: function () {
            this.isShowDialog = false;
            this.a_close && this.a_close();
        }
    },
    watch: {
        isShowDialog: function (cur, old) {
            if (cur === false) {
                this.$refs.error.parentNode.removeChild(this.$refs.error);
            }
        }
    }
})

var errorAlert = function (o) {
    var alertDom = new errorComponent({
        el: document.createElement('div') //将Alert组件挂载到新创建的div上
    })
    document.body.appendChild(alertDom.$el); //把Alert组件的dom添加到body里

    alertDom.errorTips = o.errorTips;
    alertDom.errorMsg = o.errorMsg;

    // 关闭事件
    alertDom.a_close = o.close || null;
}

Vue.prototype.$errorAlert = errorAlert;

// util start 公共方法
var UTIL = {};
(function () {
    UTIL = {
        // time => 2019-09-09 12:12:12
        formatDate: function (time, formatStr) {
            if (!time) return '';
            formatStr = formatStr || 'yyyy-MM-dd hh:mm';
            if (typeof time == 'string' && time.split('-').length > 1) {
                return time.substring(0, formatStr.length);
            }
            var date = new Date(time);
            if (!date) return '';
            return formatDate(date, formatStr);
        },
        // 获取当前网页url参数
        getUrlParam: function (name) {
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
            var r = window.location.search.substr(1).match(reg);
            if (r != null) {
                return unescape(r[2]);
            }
            return null;
        },
        // 关闭当前页面
        closeCurrentWindow: function () {
            window.close();
        },
        // 延迟关闭页面
        delayCloseWindow: function (time) {
            window.setTimeout(function () {
                UTIL.closeCurrentWindow();
            }, time || 2000);
        },
        // 文件类型对应字体文件数据
        staticIconData: {
            "7Z": {text: "&#xe63c", color: "rgb(87, 193, 255)"},
            "AI": {text: "&#xe63d", color: "rgb(255, 132, 0)"},
            "AVI": {text: "&#xe63e", color: "rgb(239, 52, 80)"},
            "BMP": {text: "&#xe63f", color: "rgb(201, 190, 24)"},
            "EPS": {text: "&#xe640", color: "rgb(64, 123, 248)"},
            "EXE": {text: "&#xe641", color: "rgb(246, 228, 0)"},
            "FLV": {text: "&#xe642", color: "rgb(218, 60, 9)"},
            "DOC": {text: "&#xe643", color: "rgb(56, 120, 222)"},
            "DOCX": {text: "&#xe643", color: "rgb(56, 120, 222)"},
            "GIF": {text: "&#xe644", color: "rgb(132, 220, 0)"},
            "MOV": {text: "&#xe645", color: "rgb(176, 215, 0)"},
            "HTML": {text: "&#xe646", color: "rgb(108, 182, 0)"},
            "MP4": {text: "&#xe647", color: "rgb(52, 130, 240)"},
            "PDF": {text: "&#xe648", color: "#fb7878"},
            "MP3": {text: "&#xe649", color: "rgb(71, 77, 226)"},
            "PPT": {text: "&#xe64a", color: "rgb(248, 82, 7)"},
            "PPTX": {text: "&#xe64a", color: "rgb(248, 82, 7)"},
            "PNG": {text: "&#xe64b", color: "rgb(252, 204, 0)"},
            "PSD": {text: "&#xe64c", color: "rgb(54, 118, 244)"},
            "RAR": {text: "&#xe64d", color: "rgb(26, 142, 247)"},
            "SVG": {text: "&#xe64e", color: "rgb(26, 142, 247)"},
            "SWF": {text: "&#xe64f", color: "rgb(181, 107, 0)"},
            "RP": {text: "&#xe650", color: "rgb(113, 60, 190)"},
            "TIF": {text: "&#xe651", color: "rgb(67, 167, 59)"},
            "TXT": {text: "&#xe652", color: "rgb(85, 215, 224)"},
            "ZIP": {text: "&#xe653", color: "rgb(220, 78, 193)"},
            "JPG": {text: "&#xe654", color: "rgb(61, 182, 251)"},
            "WPS": {text: "&#xe655", color: "rgb(51, 211, 157)"},
            "TAR": {text: "&#xe656", color: "rgb(186, 76, 215)"},
            "XSL": {text: "&#xe657", color: "rgb(139, 199, 85)"},
            "XSLX": {text: "&#xe657", color: "rgb(139, 199, 85)"},
            "DWG": {text: "&#xe70f;", color: "#3878DE"},
            "DXF": {text: "&#xe70e;", color: "#FE830C"},
        },
        getIconData: function (type) {
            var defalutData = {text: "&#xe6b1", color: "rgb(56, 120, 222)"};
            return UTIL.staticIconData[type.toUpperCase()] || defalutData;
        },
        getIconText: function (type) {
            return UTIL.getIconData(type).text;
        },
        getIconData: function (type) {
            return UTIL.getIconData(type).color;
        },
    };
})();

// util  end

/**
 * 非本地环境，用户c模式和r模式的切换的请求处理
 * @param cb
 */
function getTokenReady(cb) {
    if (_isLocalConfFn()) {
        cb();
        return;
    }
    var tempCtx = '';
    request('',
        {url: ctx + 'opus/admin/getOpusAdminRestServerUrl', type: 'get'},
        function (data) {
            if (data.message) {
                tempCtx = data.message;
                request('',
                    {url: ctx + 'opus/admin/getAccessToken', type: 'get'},
                    function (data) {
                        if (data.content) {
                            Token = data.content;
                            localStorage.setItem("access_token", Token);
                            requestCtx = tempCtx;
                            cb();
                        } else {
                            cb();
                        }
                    }, function (msg) {
                        cb();
                    })
            } else {
                cb();
            }
        }, function (msg) {
            cb();
        })
}

// 切换主题颜色
function setThemeColoFn(color) {
    var cacheThemeColor = localStorage.getItem('themeColor');
    if (!color && !cacheThemeColor) return;
    if (color && color != cacheThemeColor) {
        localStorage.setItem('themeColor', color);
    }
    if (!color) {
        color = cacheThemeColor;
    }

    var hasBpmTag = window.location.href.indexOf('bpm-front-ui') !== -1;
    if (localStorage.getItem("SYSTEM_TAG") === 'protal' || hasBpmTag) {
        document.documentElement.style.setProperty('--themeColor', color);
        document.documentElement.style.setProperty('--themeColorTransp', colorOxToRgba(color, 0.1)); //透明的主题色
    }
}

// 将rgb颜色转成16进制
function colorRgbToOxFn(color) {
    var reg = /^(rgb|RGB)/;
    var color = color;
    if (reg.test(color)) {
        var strHex = "#";
        // 把RGB的3个数值变成数组
        var colorArr = color.replace(/(?:\(|\)|rgb|RGB)*/g, "").split(",");
        // 转成16进制
        for (var i = 0; i < colorArr.length; i++) {
            var hex = Number(colorArr[i]).toString(16);
            if (hex === "0") {
                hex += hex;
            }
            strHex += hex;
        }
        return strHex;
    } else {
        return String(color);
    }
};

//切换主题颜色路径
function setThemeCssLink(themeCssFilePath) {
    var linkObj = document.getElementById('themeVer');
    var cacheFilePath = localStorage.getItem('themeCssFilePath');
    //都没有的情况
    if (!themeCssFilePath && !cacheFilePath) {
        //linkObj.setAttribute("href", originCssHref);
        return;
    }
    //如果传进来有，缓存没有，设置缓存
    if (themeCssFilePath && themeCssFilePath != cacheFilePath) {
        localStorage.setItem('themeCssFilePath', themeCssFilePath);
    }
    // 如果传进来没有，取缓存
    if (!themeCssFilePath) {
        themeCssFilePath = cacheFilePath;
    }
    var hasBpmTag = window.location.href.indexOf('bpm-front-ui') !== -1;
    if (localStorage.getItem("SYSTEM_TAG") === 'protal' || hasBpmTag) {
        if (linkObj != null) {
            if (themeCssFilePath.indexOf('http') == '-1') {
                linkObj.setAttribute("href", ctx + themeCssFilePath);
            } else {
                linkObj.setAttribute("href", themeCssFilePath);
            }
        }
    }

}

// 将16进制颜色转成rgba,color: 16进制颜色  opacity: 透明度0-1
function colorOxToRgba(color, opacity) {
    // 16进制颜色值的正则
    var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/;
    // 把颜色值变成小写
    var color = (color.replace(/^\s+|\s+$/g, "")).toLowerCase();
    opacity = opacity || 0.2;
    if (reg.test(color)) {
        // 如果只有三位的值，需变成六位，如：#fff => #ffffff
        if (color.length === 4) {
            var colorNew = "#";
            for (var i = 1; i < 4; i += 1) {
                colorNew += color.slice(i, i + 1).concat(color.slice(i, i + 1));
            }
            color = colorNew;
        }
        // 处理六位的颜色值，转为RGB
        var colorChange = [];
        for (var i = 1; i < 7; i += 2) {
            colorChange.push(parseInt("0x" + color.slice(i, i + 2)));
        }
        return "RGBA(" + colorChange.join(",") + ',' + opacity + ")";
    } else if (color.indexOf('rgb') > -1 && color.indexOf('rgba') == -1) {
        colorOxToRgba(colorRgbToOxFn(color), opacity);
    } else {
        return color;
    }
};

window.addEventListener('message', function (e) {
    if (e.data.key === 'changeTheme') {
        if (e.data.systemTag) {
            var SYSTEM_TAG = e.data.systemTag;
            localStorage.setItem('SYSTEM_TAG',SYSTEM_TAG);
        }
        if (e.data.cssFilePath) {
            var themeCssFilePath = e.data.cssFilePath;
            setThemeCssLink(themeCssFilePath);
        }
        if (e.data.themeColor) {
            var themeColor = e.data.themeColor;
            setThemeColoFn(themeColor);
        }


    }

    if (e.data.key === 'removeAccessToken') {
        // console.log('清除token');
        localStorage.removeItem('access_token');
        //另开标签
        if (window.opener) {
            localStorage.removeItem("access_token");
            //ht 0525 清空accessToken同时也清空主题相关缓存
            localStorage.removeItem('themeColor');
            localStorage.removeItem('themeCssFilePath');
            localStorage.removeItem('SYSTEM_TAG');
            window.close();
        } else {
            if (top !== window.self) {
                localStorage.removeItem("access_token");
            } else {
                localStorage.removeItem("access_token");
                try {
                    window.vm && window.vm.logoutAfterFn();
                } catch (e) {
                }
                window.location.href = pctx + 'authentication/require';
            }
        }
    }
});

window.addEventListener('load', function () {
    var currentHref = window.location.href;
    var linkObj = document.getElementById('themeVer');
    //如果当前的url连接有admin的标志，不用处理自定义样式处理。
    if(currentHref.indexOf('system_tag=admin') != -1) {
        if(linkObj && cacheDefaultCssLink){
            linkObj.setAttribute("href", cacheDefaultCssLink);
        }
        return;
    }

    //【注：为了处理protal项目和admin项目共同使用同个内容页主题色保持不一样情况】
    // ht todo list 0602 为了解决win打开的情况，如果是protal打开的浏览器tab，就在首页加上这个参数
    var urlPortal = _getQueryString('system_tag');
    // ht todo list 0603 自定义设置，如果是bpm-front-ui，都要设置主题颜色，不用考虑admin里面包含的情况
    var hasBpmTag = window.location.href.indexOf('bpm-front-ui') !== -1;
    if (localStorage.getItem("SYSTEM_TAG") === 'protal' || urlPortal === 'protal' || hasBpmTag) {
        setThemeCssLink(localStorage.getItem('themeCssFilePath'));
        setThemeColoFn(localStorage.getItem('themeColor'));
    }else{

        if(linkObj && cacheDefaultCssLink){
            linkObj.setAttribute("href", cacheDefaultCssLink);
        }
    }
});

document.addEventListener('DOMContentLoaded', function() {
    var linkObj = document.getElementById('themeVer');
    if(linkObj){
        cacheDefaultCssLink = linkObj.getAttribute('href');
        //linkObj.setAttribute("href", '');  //会有默认element样式，故还是会有过渡效果
    }
})






